import React from 'react';
import { Form } from 'antd';
import { FormLayout, Newline } from '../../components';
import Previewer from '../Previewer';

const def = '无';
export default function GuideDetail({ data = {} }) {
    const { guideTime, recordsUrl, summary, file = [] } = data;
    return (
        <>
            <FormLayout type="full">
                <Form.Item label="引导时间">{guideTime || def}</Form.Item>
            </FormLayout>
            <FormLayout type="full">
                <Form.Item label="录音">
                    {recordsUrl ? (
                        <audio controls="controls" style={{ height: 30, width: 240 }} src={recordsUrl}>
                            <track kind="captions" />
                        </audio>
                    ) : (
                        def
                    )}
                </Form.Item>
            </FormLayout>
            <FormLayout type="full">
                <Form.Item label="沟通纪要">
                    <Newline text={summary || def} />
                </Form.Item>
            </FormLayout>
            <FormLayout type="full">
                <Form.Item label="相关资料">{file[0] ? <Previewer data={file[0]} /> : def}</Form.Item>
            </FormLayout>
        </>
    );
}
